<template>
  <a-modal v-model:visible="visible" :title="modalTitle" width="35%" @ok="handleOk" @cancel="handleCancel" :maskClosable="false"
  >
    <a-form ref="formRef" :model="formState">
      <a-form-item
          label="用户编码"
          name="code"
          :rules="[{ required: true, message: '请输入用户编码' }]"
      >
        <a-input v-model:value="formState.code" placeholder="请输入用户编码" style="width: 300px"/>
      </a-form-item>


    </a-form>

  </a-modal>
</template>
<script setup>
import useModal from "@/utils/useModal";
import {reactive, ref} from "vue";
import {message} from "ant-design-vue";
import {bindUser} from "@/api/contact";

const {visible, modalTitle} = useModal();
const emits = defineEmits(["model-success"]);
const formRef = ref();

const formState = reactive({
  code: "",
});
const show = (model) => {
  visible.value = true;
  modalTitle.value = "绑定用户";
};

// 保存
const handleOk = async () => {
  await formRef.value.validate().then(() => {
    bindUser(formState).then(res => {
      if (res.code === 0) {
        message.success(res.msg);
        formRef.value.resetFields();
        visible.value = false;
        emits("model-success");
      }
    })
  });
};
// 关闭
const handleCancel = () => {
  formRef.value.resetFields();
  visible.value = false;
};
defineExpose({
  show,
});
</script>
<style scoped lang="scss">

</style>